/* eslint-disable no-unused-vars */
/*  */
const path = require("path");
const webpack = require("webpack");

function resolve(dir) {
  return path.join(__dirname, dir);
}
/* externals */
const externals = {
  // echarts: "echarts"
};

const cdnAddress = `${process.env.VUE_APP_CDN_PATH}${process.env.VUE_APP_VERSION}`;

const cdn = {
  css: [],
  js: [
    // `./plugins/echarts-3.8.5/echarts.common.min.js`
  ]
};

module.exports = {
  // 基本路径
  publicPath: process.env.NODE_ENV === "production" ? "./" : "/",
  // 输出文件目录
  outputDir: "dist", // 默认dist
  // 用于嵌套生成的静态资产（js,css,img,fonts）目录
  // assetsDir: '',
  // 指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径
  filenameHashing: true,
  // 构建多页时使用
  // pages: {},
  // eslint-loader是否在保存的时候检查
  lintOnSave: false,
  // 是否使用包含运行时编译器的Vue核心的构建
  runtimeCompiler: false,
  // 默认情况下 babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel 显式转译一个依赖，可以在这个选项中列出来
  transpileDependencies: [],
  // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。
  productionSourceMap: false,
  // 如果这个值是一个对象，则会通过 webpack-merge 合并到最终的配置中。
  // 如果这个值是一个函数，则会接收被解析的配置作为参数。该函数及可以修改配置并不返回任何东西，也可以返回一个被克隆或合并过的配置版本。
  // eslint-disable-next-line no-unused-vars
  configureWebpack: config => {
    if (process.env.NODE_ENV === "production") {  
      return {
        externals
      };
      // 为生产环境修改配置...
    }
    // config.devtool = "source-map";
    return {
      devtool: "source-map"
    };
    // 为开发环境修改配置...
  },
  // 是一个函数，会接收一个基于 webpack-chain 的 ChainableConfig 实例。允许对内部的 webpack 配置进行更细粒度的修改。
  chainWebpack: config => {
    if (process.env.use_analyzer) {
      config
        .plugin("webpack-bundle-analyzer")
        .use(require("webpack-bundle-analyzer").BundleAnalyzerPlugin);
    }

    // set svg-sprite-loader
    config.module
      .rule("svg")
      .exclude.add(resolve("src/icons"))
      .end();
    config.module
      .rule("icons")
      .test(/\.svg$/)
      .include.add(resolve("src/icons"))
      .end()
      .use("svg-sprite-loader")
      .loader("svg-sprite-loader")
      .options({
        symbolId: "icon-[name]"
      })
      .end();

    config
      // https://webpack.js.org/configuration/devtool/#development
      .when(process.env.NODE_ENV === "development", () => {
        config.devtool("cheap-source-map");
      });
    // https://cli.vuejs.org/zh/config/#pages
    // 以下配置会导致 pages 失效
    config.when(process.env.NODE_ENV !== "development", () => {
      config
        .plugin("html")
        .tap(args => {
          // eslint-disable-next-line no-param-reassign
          args[0].cdn = cdn;
          return args;
        })
        .end();
      config
        .plugin("ScriptExtHtmlWebpackPlugin")
        .after("html")
        .use("script-ext-html-webpack-plugin", [
          {
            // `runtime` must same as runtimeChunk name. default is `runtime`
            inline: /runtime\..*\.js$/
          }
        ])
        .end();
      config.optimization.splitChunks({
        chunks: "all",
        cacheGroups: {
          libs: {
            name: "chunk-libs",
            test: /[\\/]node_modules[\\/]/,
            priority: 10,
            chunks: "initial" // 只打包初始时依赖的第三方
          },
          elementUI: {
            name: "chunk-elementUI", // 单独将 elementUI 拆包
            priority: 20, // 权重要大于 libs 和 app 不然会被打包进 libs 或者 app into libs or app
            test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
          },
          commons: {
            name: "chunk-commons",
            test: resolve("src/components"), //  可自定义拓展你的规则
            minChunks: 3, //  最小共用次数
            priority: 5,
            reuseExistingChunk: true
          }
        }
      });
      config.optimization.runtimeChunk("single");
    });
    /* config.module
      .rule('images')
      .use('url-loader')
        .loader('url-loader')
        .tap(options => {
          // 修改它的选项...
          return options
        }) */
  },
  // css相关配置
  css: {
    // 启用 CSS modules
    requireModuleExtension: true,
    // 是否使用css分离插件
    extract: true,
    // 开启 CSS source maps?
    sourceMap: false,
    // css预设器配置项
    loaderOptions: {
      sass: {
        prependData: '@import "src/assets/scss/_util.scss";'
      }
    }
  },
  // webpack-dev-server 相关配置
  devServer: {
    port: 8080,
    // https: true,
    open: false,
    proxy: {
      // 设置代理
      //对内的后端服务器的请求需要被代理
      //但访问阿里的OSS不能被代理
      //你要加一个配置，当访问的是OSS地址时，不能被代理
      [process.env.VUE_APP_API_PREFIX_URL]: {
        target: process.env.VUE_APP_API_PROXY_URL,
        changeOrigin: true,
        ws: true,
        pathRewrite: {
          [process.env.VUE_APP_API_PREFIX_URL]: ""
        }
      },
      "^/live": {
        target: "http://rtmp.ambcon.cn",
        changeOrigin: true,
        ws: true,
        pathRewrite: {
          "/live": ""
        }
      }
    }

    // before: (app) => { },
  },
  // PWA 插件相关配置
  pwa: {},
  // 第三方插件配置
  pluginOptions: {
    // ...
  }
};
